<template>
  <a-drawer
    title="答辩分组详情"
    wrapClassName="fullscreen"
    height="100%"
    placement="bottom"
    :closable="false"
    @close="handleCancel"
    :visible="prevVisible" >
    <a-alert class="card" :message="'组号为'+data.dbfzbh+'的下面共有'+memberData.length+'位委员'" type="info" />
        <a-card class="card" :bordered="false">
        <a-table
          ref="table"
          size="default"
          rowKey="key"
          :columns="memberColumns"
          :loading="loading"
          :dataSource="memberData"
          :pagination="false"
        >
          <span slot="serial" slot-scope="text, record, index">
            {{ index + 1 }}
          </span>
          <span slot="dbfzbh" slot-scope="text, record, index">
            {{ data.dbfzbh }}
          </span>
        </a-table>
        </a-card>
        <a-alert class="card" :message="'组号为'+data.dbfzbh+'的下面共有'+studentData.length+'位学生'" type="info" />
        <a-card class="card" :bordered="false">
        <a-table
          ref="table"
          size="default"
          rowKey="key"
          :columns="studentColumns"
          :loading="loading"
          :dataSource="studentData"
          :pagination="false"
        >
          <span slot="serial" slot-scope="text, record, index">
            {{ index + 1 }}
          </span>
          <span slot="dbfzbh" slot-scope="text, record, index">
            {{ data.dbfzbh }}
          </span>
          <span slot="dbrq" slot-scope="text, record, index">{{ text }} {{ record.dbrqswhxwmc }}</span>
        </a-table>
        </a-card>
    <div class="drawer-bootom-button" style="z-index:1">
        <div style="float:right">
          <a-button type="primary" @click="handleAudit(i.code)" v-for="i,idx in TYPE0371" :key="idx" v-if="i.code!=='01'" style="margin-left:5px ">{{ i.name }}</a-button>
          <a-button type="primary" @click="handleCancel">关闭窗口</a-button>
        </div>
    </div>
  </a-drawer>
</template>

<script>
import { mapState } from 'vuex'

export default {
  props: {
    prevVisible: {
      default: false
    },
    data:{
      default:function(){
        return {}
      }
    }
  },
  computed: {
    ...mapState({
      TYPE0371: state => state.app['TYPE0371'] // 审核结果
    })
  },
  data () {
    return {
      loading: false,
      memberData:[],
      studentData: [],
      memberColumns: [
        {
          title: '序号',
          scopedSlots: { customRender: 'serial' }
        },
        {
          title: '组号',
          scopedSlots: { customRender: 'dbfzbh' }
        },
        {
          title: '姓名',
          dataIndex: 'xm'
        },
        {
          title: '职称',
          dataIndex: 'zcmmc'
        },
        {
          title: '工作单位',
          dataIndex: 'gzdw'
        },
        {
          title: '成员类型',
          dataIndex: 'cylxmc'
        },
        {
          title: '是否博导',
          dataIndex: 'sfbdmc'
        },
        {
          title: '是否硕导',
          dataIndex: 'sfsdmc'
        },
        {
          title: '是否校外',
          dataIndex: 'sfxwrymc'
        }
      ],
      studentColumns: [
        {
          title: '序号',
          scopedSlots: { customRender: 'serial' }
        },
        {
          title: '组号',
          scopedSlots: { customRender: 'dbfzbh' }
        },
        {
          title: '学号',
          dataIndex: 'xh'
        },
        {
          title: '姓名',
          dataIndex: 'xm'
        },
        {
          title: '所属院系',
          dataIndex: 'ssyxmc'
        },
        {
          title: '所属专业',
          dataIndex: 'sszymc'
        },
        {
          title: '学生类别',
          dataIndex: 'xslbmc'
        },
        {
          title: '导师',
          dataIndex: 'dsxm'
        },
        {
          title: '答辩时间',
          dataIndex: 'dbrq',
          scopedSlots: { customRender: 'dbrq' }
        },
        {
          title: '答辩地点',//缺省
          dataIndex: 'dbdd'
        }
      ]
    }
  },
  watch:{
    data(){
      this.handleLoad();
    }
  },
  methods: {
    //加载详情
    handleLoad(){
      if (!this.data.id) return;
      this.loading=true;
      Promise.all([
        this.$api.degree.pleaGroupMember({
        dbfzxxId:this.data.id
      }),this.$api.degree.pleaGroupStudent({
        dbfzxxId:this.data.id
      })]).then((res)=>{
        this.loading=false;
        this.memberData = res[0].data
        this.studentData = res[1].data
        this.studentData.map(item =>{
          item.dbrq=item.dbrq.slice(0,10)
          return item
        })
      })
    },
    //审核
    handleAudit(code){
      if (!this.data.id) return;
      this.$api.degree.pleaGroupAudit({
        ids:this.data.id,
        shjg:code
      }).then(res=>{
        this.$message.success('审核成功');
        this.$emit('success')
        this.$emit('close')
      })
    },
    // 关闭
    handleCancel () {
      this.$emit('close')
    }
  }
}
</script>

<style lang="less">
.fullscreen{
    .ant-drawer-wrapper-body{
        height: 100%;
        overflow: auto;
    }
}
</style>
